<template>
    <div id="body-padding">
        <p id="p">修改日记</p>
        <select id="group" v-model="sel">
            <option 
                v-for="a in arr" 
                :value="a._id"
            >{{a.name}}</option>
        </select>
        <textarea cols="30" rows="10" v-model.trim="data.content">
        </textarea>
        <button id="btn" @click="btnClick">保存日记</button>
    </div>
</template>

<script>

export default {
    data(){
        return {
            data:{},
            arr:[],
            sel:"",
        }
    },
    methods:{
        mount(){
            var params = {id:this.$route.params.id};
            this.http.get("/reply/update",{params})
            .then(res=>{
                if(res.data.err){
                    this.layer.alert("页面丢失");
                    history.back();
                    return;
                };
                this.data = res.data.data.data;
                this.arr = res.data.data.data1;
                this.sel = res.data.data.data1[0]._id;
            })
        },
        btnClick(){
            if(this.data.content.length<2){
                this.layer.msg("请输入日记内容");
                return;
            }
            var data = {
                id:this.data._id,
                diaryID:this.sel,
                content:this.data.content,
            }
            this.http.post("/reply/update",data)
            .then(res=>{
                this.layer.msg(res.data.msg);
                history.back();
                // window.location.href = "/#/reply/"+this.$route.params.id
            })
        }
    },
    activated(){
        this.mount();
        this.$store.dispatch("word");
    }
}
</script>

<style scoped>
#group{
    border-radius: 4px;
    border: solid 1px #999;
    width: 100%;
    height: 35px;
    margin-top: 20px;
    padding: 0 4%;
}
</style>